<!--
描述：系统应用-菜单管理-模块添加、编辑
开发人：hqj
开发日期：2018年05月24日
-->
<template lang="pug">
    kalix-dialog.user-add(bizKey="enrolmentRule" ref="kalixBizDialog" v-bind:submitBefore="submitBefore" v-bind:formModel.sync="formModel" v-bind:targetURL="targetURL")
        div.el-form.kalix-form-table(slot="dialogFormSlot" style="width:95%;")
            div.s-flex
                el-form-item.s-flex_item.kalix-form-table-td(label="试题顺序" prop="titleNum" v-bind:rules="rules.titleNum" v-bind:label-width="labelWidth")
                    kalix-dict-select(v-model="formModel.titleNum" appName="enrolment" dictType="题型顺序" )
                el-form-item.s-flex_item.kalix-form-table-td(label="试题题型" prop="quesType" v-bind:rules="rules.quesType" v-bind:label-width="labelWidth" )
                    kalix-dict-select(v-model="formModel.quesType" appName="enrolment" dictType="题型" v-on:input="change($event)")
            template(v-if="formModel.quesType === '5'")
                div.s-flex
                    el-form-item.s-flex_item.kalix-form-table-td(label="主观题题型" prop="subType" v-bind:rules="rules.subType" v-bind:label-width="labelWidth")
                        kalix-dict-select(v-model="formModel.subType" appName="enrolment" dictType="主观题类型")
                    el-form-item.s-flex_item.kalix-form-table-td(label="题型范围" prop="quesRange" v-bind:rules="rules.quesRange" v-bind:label-width="labelWidth" )
                        el-select(v-model='formModel.currentYears' v-on:change="selectChange" placeholder='请选择年份' multiple  style="width:100%;")
                            el-option(v-for="item in items" v-bind:key="item.value" v-bind:label="item.label" v-bind:value="item.value")
            template(v-if="formModel.quesType === '1'")
                div.form-rows.kalix-form-table
                    div.form-rows--cnt(v-for="(item,index) in formModel.rows")
                        div.s-flex
                            el-form-item.s-flex_item.kalix-form-table-td(label="类别" prop="subType"  v-bind:label-width="labelWidth")
                                kalix-dict-select(v-model="item.subType" appName="enrolment" dictType="类别" )
                            el-form-item.s-flex_item.kalix-form-table-td(label="题型分数" prop="typeCount"  v-bind:label-width="labelWidth")
                                el-input(v-model="item.typeCount" )
                        el-button.form-rows--del(v-if="index>0" type="danger" icon="el-icon-delete" size="mini" circle v-on:click="deleteRow(index)")
                    div.form-rows--add-c
                        el-button.form-rows--add(type="primary" icon="el-icon-plus" size="mini" circle v-on:click="addRow")
            template(v-if="formModel.quesType === '2'")
                div.form-rows.kalix-form-table
                    div.form-rows--cnt(v-for="(item,index) in formModel.rows")
                        div.s-flex
                            el-form-item.s-flex_item.kalix-form-table-td(label="类别" prop="subType"  v-bind:label-width="labelWidth")
                                kalix-dict-select(v-model="item.subType" appName="enrolment" dictType="类别" )
                            el-form-item.s-flex_item.kalix-form-table-td(label="题型分数" prop="typeCount"  v-bind:label-width="labelWidth")
                                el-input(v-model="item.typeCount" )
                        el-button.form-rows--del(type="danger" icon="el-icon-delete" size="mini" circle v-on:click="deleteRow(index)")
                    div.form-rows--add-c
                        el-button.form-rows--add(type="primary" icon="el-icon-plus" size="mini" circle v-on:click="addRow")
            div.s-flex
                el-form-item.s-flex_item.kalix-form-table-td(v-bind:label="titleName" prop="quesScore" v-bind:rules="rules.quesScore" v-bind:label-width="labelWidth")
                    el-input(v-model="formModel.quesScore" )
                el-form-item.s-flex_item.kalix-form-table-td(label="题型总分" prop="quesTotalscore" v-bind:rules="rules.quesTotalscore" v-bind:label-width="labelWidth")
                    el-input(v-model="formModel.quesTotalscore")
            div.s-flex
                el-form-item.s-flex_item.kalix-form-table-td(label="题型描述" prop="quesDesc"  v-bind:label-width="labelWidth")
                    el-input(v-model="formModel.quesDesc")
            input(type="hidden" v-model="hidenText")
</template>

<script type="text/ecmascript-6">
    import FormModel from './ruleModel'
    import {getServerCurrentDateYear} from '../common.js'

    export default {
        name: 'RuleAdd',
        data() {
            return {
                formModel: Object.assign({}, FormModel),
                rules: {
                    titleNum: [{required: true, message: '题型顺序不能为空', trigger: 'blur'}],
                    quesType: [{required: true, message: '题型不能为空', trigger: 'blur'}],
                    quesScore: [{required: true, message: '每题分数不能为空', trigger: 'blur'}],
                    quesTotalscore: [{required: true, message: '题型总分不能为空', trigger: 'blur'}],
                    subType: [{required: true, message: '主观题子题型不能为空', trigger: 'blur'}]
//            subType1: [{required: true, message: '填空题题型不能为空', trigger: 'blur'}],
//            subType2: [{required: true, message: '选择题题型不能为空', trigger: 'blur'}]
                },
                titleName: '每题分数',
                targetURL: '',
                labelWidth: '110px',
                hidenText: '',
                items: [],
                currentDateYear: (new Date()).getFullYear()
            }
        },
        components: {},
        watch: {
            formModel: {
                handler: 'watchFormModel',
                deep: true
            }
        },
        created() {
            getServerCurrentDateYear(this.axios, this.$KalixMessage, flag => {
                this.currentDateYear = flag
                for (let i = 6; i > -2; i--) {
                    this.items.push({
                        value: this.currentDateYear * 1 - i,
                        label: this.currentDateYear * 1 - i
                    })
                }
                this.initCurrentValue()
            })
        },
        methods: {
            watchFormModel(newValue, oldValue) {
                if (newValue.targetURL) {
                    this.targetURL = newValue.targetURL
                }
                //if(newValue.currentYears && newValue.currentYears!=oldValue.currentYears){
                this.initCurrentValue()
                //}
            },
            selectChange() {
                this.hidenText = (new Date()).getTime()
                this.initCurrentValue()
            },
            deleteRow(index) {
                this.hidenText = (new Date()).getTime()
                this.formModel.rows.splice(index, 1)
            },
            addRow() {
                this.hidenText = (new Date()).getTime()
                this.formModel.rows.push({
                    subType: '',
                    typeCount: ''
                })
            },
            initCurrentValue() {
                if (this.formModel.currentYears && this.formModel.currentYears.length) {
                    this.formModel.quesRange = this.formModel.currentYears.join(',')
                } else {
                    this.formModel.quesRange = null
                }
            },
            change(event) {
                if (event === '1') {
                    this.titleName = '每空分数'
                } else {
                    this.titleName = '每题分数'
                }

                if (event === '1' || event === '2') {
                    this.formModel.rows = []
                    this.addRow()
                }
            },
            submitBefore(obj_dialog, callback) {
                this.formModel.typeCount = ''
                for (let i = 0; i < this.formModel.rows.length; i++) {
                    this.formModel.typeCount += this.formModel.rows[i].subType + ',' + this.formModel.rows[i].typeCount + ';'
                    // console.log(this.formModel.typeCount)
                }
                callback()
            }
        }
    }
</script>

<style scoped lang="stylus" type="text/stylus">
    .form-rows
        position relative
        border 0
        .form-rows--cnt
            position relative
        .form-rows--del
            position absolute
            right 5px
            top 6px
        .form-rows--add-c
            position absolute
            right -34px
            bottom -14px
            .form-rows--add
                position relative
</style>
